import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';


class SearchPage extends StatefulWidget {
  const SearchPage({super.key});

  @override
  State<SearchPage> createState() => _SearchPageState();
}

class _SearchPageState extends State<SearchPage> {


  Widget _wrapWidget(){
    return Wrap(
      children: [
        Container(
          height: 50.h,
          padding: EdgeInsets.all(10.w),
          margin: EdgeInsets.all(10.w),
          decoration: BoxDecoration(
              color: const Color.fromRGBO(233, 233, 233, 0.9),
              borderRadius: BorderRadius.circular(10.w)
          ),
          child: const Text("笔记本电脑"),
        ),
        Container(
          height: 50.h,
          padding: EdgeInsets.all(10.w),
          margin: EdgeInsets.all(10.w),
          decoration: BoxDecoration(
              color: const Color.fromRGBO(233, 233, 233, 0.9),
              borderRadius: BorderRadius.circular(10.w)
          ),
          child: const Text("微星"),
        ),
        Container(
          height: 50.h,
          padding: EdgeInsets.all(10.w),
          margin: EdgeInsets.all(10.w),
          decoration: BoxDecoration(
              color: const Color.fromRGBO(233, 233, 233, 0.9),
              borderRadius: BorderRadius.circular(10.w)
          ),
          child: const Text("msi", strutStyle: StrutStyle(
            forceStrutHeight: true,
            leading: 0.5,
          )),
        ),
        Container(
          height: 50.h,
          padding: EdgeInsets.all(10.w),
          margin: EdgeInsets.all(10.w),
          decoration: BoxDecoration(
              color: const Color.fromRGBO(233, 233, 233, 0.9),
              borderRadius: BorderRadius.circular(10.w)
          ),
          child: const Text("惠普"),
        ),
        Container(
          height: 50.h,
          padding: EdgeInsets.all(10.w),
          margin: EdgeInsets.all(10.w),
          decoration: BoxDecoration(
              color: const Color.fromRGBO(233, 233, 233, 0.9),
              borderRadius: BorderRadius.circular(10.w)
          ),
          child: const Text("联想"),
        ),
        Container(
          height: 50.h,
          padding: EdgeInsets.all(10.w),
          margin: EdgeInsets.all(10.w),
          decoration: BoxDecoration(
              color: const Color.fromRGBO(233, 233, 233, 0.9),
              borderRadius: BorderRadius.circular(10.w)
          ),
          child: const Text("固态硬盘"),
        ),
        Container(
          height: 50.h,
          padding: EdgeInsets.all(10.w),
          margin: EdgeInsets.all(10.w),
          decoration: BoxDecoration(
              color: const Color.fromRGBO(233, 233, 233, 0.9),
              borderRadius: BorderRadius.circular(10.w)
          ),
          child: const Text("m2",strutStyle: StrutStyle(
            forceStrutHeight: true,
            leading: 0.5,
          )),
        ),
      ],
    );
  }


  @override
  Widget build(BuildContext context) {
    ScreenUtil.init(context, designSize: const Size(750, 1334));

    return Scaffold(
      appBar: AppBar(
        title: Container(
          height: 72.h,
          decoration: BoxDecoration(
              color: Colors.black12,
              borderRadius: BorderRadius.circular(20)
          ),
          child: TextField(
            autofocus: false,
            decoration: InputDecoration(
              border: OutlineInputBorder(
                borderSide: BorderSide.none,
                borderRadius: BorderRadius.circular(30)
              )
            ),
          ),
        ),
        actions: [
          InkWell(
            child: SizedBox(
              height: 72.h,
              width: 80.w,
              child: const Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Text("搜索")
                ],
              ),
            ),
            onTap: (){

            },
          )
        ],
      ),
      body: Padding(
        padding: EdgeInsets.all(10.w),
        child: ListView(
          children: [
            Container(
              child: Text("热搜",style: Theme.of(context).textTheme.titleLarge),
            ),
            const Divider(),
           _wrapWidget(),
            SizedBox(height: 10.h,),
            Container(
              child: Text("历史记录",style: Theme.of(context).textTheme.titleLarge),
            ),
            const Divider(),
            const Column(
              children: [
                ListTile(
                  title: Text("联想拯救者",style: TextStyle(fontSize: 14)),
                ),
                Divider(),
                ListTile(
                  title: Text("联想拯救者",style: TextStyle(fontSize: 14)),
                ),
                Divider(),
                ListTile(
                  title: Text("联想拯救者",style: TextStyle(fontSize: 14)),
                ),
                Divider(),ListTile(
                  title: Text("联想拯救者",style: TextStyle(fontSize: 14)),
                ),
                Divider(),
                ListTile(
                  title: Text("联想拯救者",style: TextStyle(fontSize: 14)),
                ),
                Divider(),
              ],
            ),
            SizedBox(height: 100.h),
            OutlinedButton.icon(
              onPressed: () {  },
              icon: const Icon(Icons.delete),
              label: const Text("清空历史记录"),
            )
          ],
        ),
      )
    );
  }
}
